<template>
  <div class="main_box" style="padding:10px">
    <div class="add_wrap">
      <div class="tit">
        <h2>基础信息</h2>
        <el-button type="success" plain size="small" icon="fa fa-mail-forward" @click="returnList">返回</el-button>
      </div>
      <el-form :model="dataForm" ref="dataForm" label-width="200px" :rules="roleRules" :validate-on-rule-change="false">
        <el-row>
          <!--<el-form-item label="SSO用户：" prop="casUserId">
            <el-select v-model="dataForm.casUserId" :disabled="true" placeholder="请选择SSO用户">
              <el-option v-for="item in options" :key="item.id" :label="item.userName" :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>-->
          <el-form-item label="详细地址：" prop="liveAddress" v-if="dataForm.userRole == 1">
            <el-input v-model="dataForm.liveAddress" :clearable="true"></el-input>
          </el-form-item>
          <el-form-item label="用户类型：" prop="userRole" v-if="dataForm.userRole == 1">
            <el-select v-model="dataForm.detailRole" placeholder="请选择用户类型">
              <el-option label="管理员" :value="1"></el-option>
              <el-option label="社区管理员" :value="5"></el-option>
              <el-option label="业务员" :value="10"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="公司：" prop="departId" v-show="dataForm.userRole == 1||dataForm.userRole==4&&dataForm.detailRole==2">
            <el-cascader v-model="dataForm.departId" :options="departList"
              :props="{ value: 'departId', label: 'departName', children: 'childrens', checkStrictly: true, emitPath: false }"
              clearable filterable>

            </el-cascader>
          </el-form-item>
          <el-form-item label="平台商户：" prop="businessId" v-show="dataForm.detailRole==10">
            <el-select v-model="dataForm.businessId" placeholder="请选择平台商户" clearable filterable>
              <el-option v-for="item in businessList" :label="item.name" :value="item.id" :key="item.id"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="是否语音提醒" prop="isRemind" v-show="dataForm.userRole == 1">
            <el-radio-group v-model="dataForm.isRemind">
              <el-radio :label="0">否</el-radio>
              <el-radio :label="1">是</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="备注：" prop="remark" v-show="dataForm.userRole == 1">
            <el-input v-model="dataForm.remark" :clearable="true"></el-input>
          </el-form-item>
        </el-row>

        <el-row>
          <el-form-item>
            <el-button plain type="primary" @click="sureAddClick">保 存</el-button>
            <el-button @click="returnList">取 消</el-button>
          </el-form-item>
        </el-row>
      </el-form>
    </div>
  </div>
</template>

<script>
import AuthApi from "@/api/system/auth";
import * as message from "@/constants/message";
import DepartApi from "../../api/system/depart";
import { listSsoUser } from "@/api/system/ssoUser";
import BusinessApi from "@/api/business/business";

export default {
  data() {
    return {
      dataForm: {
        userId: "",
        casUserId: "",
        businessId:"",
        remark: "",
        isRemind: 1,
        userRole: "",
        detailRole: "",
        liveAddress: "",
        departId: "",
      },
      options: [],
      departList: [],
      businessList:[],
      roleRules: {
        isRemind: [
          { required: true, message: "请选择是否语音提醒", trigger: "change" }
        ],
      }
    };
  },
  // },
  beforeRouteLeave(to, from, next) {
    to.meta.keepAlive = true;
    next();
  },
  mounted() {
    this.init();
    this.listData();
  },
  methods: {
    init() {
      this.getData();
      this.getBusinessList({businessType:3})
    },
    listData() {
      this.options = [];
      this.loading = true;
      listSsoUser().then(data => {
        this.options = data.data
        this.loading = false;
      });
    },
    getData() {
      if (this.$route.query.id) {
        this.dataForm.userId = this.$route.query.id;
        AuthApi.getUserInfo({ userId: this.$route.query.id }).then(res => {
          this.$Utils.bindingBean(this.dataForm, res.data);
          if (res.data.object) {
            this.dataForm.isRemind = parseInt(res.data.object.isRemind);
            this.dataForm.detailRole = parseInt(res.data.object.userRole);
            this.dataForm.liveAddress = res.data.object.liveAddress;
            this.dataForm.remark = res.data.object.remark;
            this.dataForm.departId = res.data.object.departId

            // if(res.data.admin.userRole==1){

            // }
          }
          this.getDepartList()

        });
      }
    },
    // 禁止输入空格
    keydown(e) {
      if (e.keyCode == 32) {
        e.returnValue = false;
      }
    },
    getDepartList() {
      DepartApi.listDeparts().then(res => {
        this.departList = res.data || []
      })
    },
    // 获取商户列表
    getBusinessList() {
          BusinessApi.listIdNameVo().then(res => {
              this.businessList = res.data
          })
      },
    sureAddClick() {
      this.$refs.dataForm.validate(valid => {
        // 判断手机号
        // if(this.dataForm.phone.length>0&&!this.$Utils.isMobile(this.dataForm.phone)){
        //        this.$message.error("手机号码格式错误");
        //      return;
        // }
        //
        if (valid) {
          this.$confirm(
            message.MSG_CONFIRM_SAVE,
            message.TITLE_PROMPT,
            {}
          ).then(() => {
            this.editData();
          });
        }
      });
    },
    editData() {
      let data = {
        userId: this.dataForm.userId,
        isRemind: this.dataForm.isRemind,
        userRole: this.dataForm.userRole,
        detailRole: this.dataForm.detailRole,
        remark: this.dataForm.remark,
        liveAddress: this.dataForm.liveAddress,
        casUserId: this.dataForm.casUserId,
        departId:this.dataForm.departId
      };
      if(data.detailRole==10){
        data.businessId = this.dataForm.businessId
      }
      AuthApi.editUser(data).then(data => {
        this.$Utils.notifySuccess();
        this.returnList();
      });
    },
    returnList() {
      this.$store.dispatch("delView", this.$route);
      this.$router.push({ path: "/sys/userManagement" });
    }

  }
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/views/add.scss";
</style>
